<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <title>猪八戒-绑定成功</title>
        <meta name="keywords" content="威客,兼职,创意">
        <meta content="width=device-width,initial-scale=1.0,user-scalable=no,target-densitydpi=medium-dpi" name="viewport">
        <meta name="format-detection" content="telephone=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
    	<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
        <link href="./css/webApp.css" rel="stylesheet" type="text/css">
        <style>
            body {
                height:100%;
                background-color: #e8e8e8;
            }
            .bindedPage {
                width: 100%;
                font-family: "microsoft yahei";
                position: relative;
            }
            .bindedHeader {
                text-align: center;
                margin:3em auto 2em auto;
                padding:0px 1em 0px 1em;
                background: url(img/title.png) no-repeat 1em 0;
                background-size: 30% auto;
            }
            .bindedH1 {
              	font:bold 1.5em/83.5px 'Microsoft Yahei';
                position: relative;
                left: 2.0em;
            }
            .bindedContent {
                width: 16em;
                padding: 0 0.75em 0 0.75em;
            	margin: 0px auto;
            	text-align: center;
            }
            .bindedP{
                margin: 0px auto 1em auto;
                text-align: left;
            }
            .bindedButton {
                text-align: center;
                padding-bottom: 1em;
            }
            .bindedButton button {
            	border-radius: 2.5px;
                height: 2.2em;
                line-height: 2.2em;
                width: 7.28em;
                font-size:1.1em;
            }
             @media screen and (max-width:319px) { 
                .bindedHeader {
                    background-size: 25% auto;
                }
                .bindedH1 {
                    left:1em;
                }
                .bindedContent{
                    width: 14em;
                    padding:0 0.25em 0 0.25em;
                }
            }
        </style>
    </head>
    <body>
        <div id="warp">
            <div class="bindedPage">
                <div class="bindedContent">
                    <header class="bindedHeader">
                        <h1 class='bindedH1'>绑定成功！</h1>
                    </header>
                    <section class="bindedForm">
                        <p class='bindedP'>
                            您已经成功绑定猪八戒账户“聪明的笨蛋聪明的笨蛋聪明的笨蛋聪明的笨蛋”，
                        </p>
                        <p class='bindedP'>
                            现在您可以用微信吼出您的需求啦。</p>
                        <div class="button bindedButton">
                            <button>确定</button>
                        </div>
                    </section> 
                </div>
            </div>
        </div>
    </body>
</html>